<template>
  <div class="app-container calendar-list-container">

    <!-- 查询和其他操作 -->
    <div class="filter-container">
      <el-input clearable class="filter-item" style="width: 200px;" placeholder="请输入商品编号" v-model="listQuery.goodsId"></el-input>
      <el-button class="filter-item" type="primary" v-waves icon="el-icon-search" @click="getDataCount()">查询</el-button>
    </div>


    <el-table size="small" :data="list"  border fit highlight-current-row v-if="isShow">

      <el-table-column align="center" label="昨日付费次数" width="600">
          <template slot-scope="scope">
              <span>{{scope.row.lastData}} 次</span>
          </template>
      </el-table-column>
      <el-table-column align="center" label="今日付费次数" width="600">
          <template slot-scope="scope">
              <span>{{scope.row.nowData}} 次</span>
          </template>
      </el-table-column>
    </el-table>

  </div>
</template>

<style>
  .table-expand {
    font-size: 0;
  }
  .table-expand label {
    width: 100px;
    color: #99a9bf;
  }
  .table-expand .el-form-item {
    margin-right: 0;
    margin-bottom: 0;
  }
  .gallery {
    width: 80px;
    margin-right: 10px;
  }
</style>

<script>
import { queryData } from '@/api/qr/dataCount/index'
import { mapGetters } from 'vuex'
import waves from '@/directive/waves' // 水波纹指令
export default {
  name: 'attributeList',
  directives: {
    waves
  },
  data() {
    return {
      listQuery: {
        goodsId: ''
      },
      lastData: 0,
      nowData: 0,
      isShow: false,
      list: []
    }
  },
  computed: {
    ...mapGetters([
      'elements',
      'name'
    ])
  },
  created() {

  },
  methods: {
    getDataCount() {
      this.list = []
      if (this.listQuery.goodsId === '' || this.listQuery.goodsId === null) {
        alert('输入商品编号')
        return
      }
      queryData(this.listQuery).then(response => {
        var str = {}
        str.lastData = response.data.lastDayPayCount
        str.nowData = response.data.toDayPayCount
        console.log(str)
        this.list.push(str)
        console.log(this.list)
        this.isShow = true
      }).catch(() => {

      })
    }
  }
}
</script>
